<template>
  <div class="prictureCar">
    <div class="good_list">
      <h1>闲置帖子列表</h1>
    </div>
    <ul class="shooping">
      <li v-for="(item,index) in goodlist" @click="toDetails(item,!$store.state.isLogin)">
        <div class="carpick">
          <img :src="item.productImageditys" alt="">
          <p>{{item.publishTimeditys}}</p>
          <div>
            <span>{{item.price}}</span>
            <span>{{item.numberOfViewsditys}}</span>
          </div>
        </div>
     </li>
    </ul>
    

  
  </div>
</template>

<script>

import axios from 'axios'
export default {
  name: 'prictureCar',
  data() {
    return {
      currentDate: new Date(),
      goodlist:[],
      userId: JSON.parse(localStorage.getItem('user')).id,
    }
  },
  components: {

  }
  ,
  created(){
    axios
        .get('/api/Commoditys/GetCommoditys')
        .then(response => this.goodlist = response.data)
        .catch((error) => console.log(error));
  },
  methods:{
    
    
    toDetails(item,islogin){
      
     if(!islogin){
      console.log(item.id);
      this.$router.push({path:"/details",query:{id:item.id,userId:this.userId}});
     }
     else{
      alert("请登录");
      this.$router.push('/login');
     }
    
 
    }
  }

}
</script>


<style >
  .shooping{
    display: flex;
    list-style: none;
   
    flex-wrap: wrap;

  }
  .shooping li{
    width: 19%;
    height: 300px;
    margin: 15px 1% 10px 0;
    padding: 16px 16px 0;
    background: #fff;
    box-sizing: border-box;
    border-radius: 4%;
    border: 1px solid #ebeef5;
    transition: all .3s;
    box-shadow: 0 2px 12px 0 rgb(0, 0, 0 / 10%);
  }
  
  .shooping li img{
    width: 90%;
     height: 170px;
  }
</style>

